export default {
  data() {
    return {
      currentSubView: undefined,
      currentSubViewName: '',
    };
  },

  computed: {
    isSubContentOpen() {
      return !!this.currentSubView;
    },
  },

  watch: {
    '$route.query.sub': {
      handler(current) {
        this.$_setSubView(current);
      },
      immediate: true
    }
  },

  methods: {
    setViewName(viewName) {
      this.currentSubViewName = viewName;
    },
    openSubContent(subView) {
      this.$_setSubView(subView);
      this.$router.push({...this.$store.state.route, ...{query: {...this.$store.state.route.query, ...{sub: this.currentSubView}}}});
    },
    closeSubContent() {
      this.$_setSubView(undefined);
      this.$router.push({...this.$store.state.route, ...{query: {...this.$store.state.route.query, ...{sub: this.currentSubView}}}});
    },
    $_setSubView(subView) {
      this.currentSubView = subView;
    }
  }
};